
<template>
  <div class="background">
    <div class="main">
      <a-card
        title="请选择品牌"
        :bordered="false"
        class="card"
      >
        <a-select
          class="content"
          placeholder="请选择品牌！"
          @change="selectBrand"
        >
          <a-select-option
            v-for="item in brandList"
            :key="item.code"
            class="item"
            :value="item.code"
          >
            {{ item.value }}
          </a-select-option>
        </a-select>
      </a-card>
      <a-card
        title="请选择货季"
        :bordered="false"
        class="card"
      >
        <a-select
          class="content"
          placeholder="请选择货季！"
          @change="selectSeason"
        >
          <a-select-option
            v-for="item in seasons"
            :key="item.code"
            class="item"
            :value="item.code"
          >
            {{ item.value }}
          </a-select-option>
        </a-select>
      </a-card>
       <div
      class="next"
      @click="goExamine()"
    >
      <a-icon type="right" />
    </div>
    </div>
   
  </div>

</template>
<script>
import { getSystemPro } from '@api/pattern/index.js'
export default {
  name: 'brand',
  data() {
    return {
      brandList: [],
      seasons: [],
      brand: '',
      value1: '',
      value2: '',
      season: '',
    }
  },
  computed: {
    jobNumber() {
      return this.$store.getters.userInfo.workNo || ''
    },
  },
  mounted() {
    this.getBrandList()
    this.getsysPro()
  },

  methods: {
    async getsysPro() {
      try {
        const res = await getSystemPro('season')
        this.seasons = res.data || []
     
        this.seasons = this.seasons.sort((a, b) => {
          return b.code.localeCompare(a.code, "zh-CN");
        });
        console.log(this.seasons)
      } catch (error) {
        console.log(error)
      }
    },
    async getBrandList() {
      const data = {
        jobNumber: this.jobNumber,
      }
      const res = await getSystemPro('brand', data)
      if (res.code == 200) {
        this.brandList = res.data
         this.brandList = this.brandList.sort((a, b) => {
          const arr = ['JNBY', '速写', 'LESS', 'jnby by JNBY', 'jnby for mini', 'Pomme de terre', 'A PERSONAL NOTE 73', 'JNBY HOME']
          return arr.indexOf(a.code) - arr.indexOf(b.code)
        })
      } else {
        this.$message.error(res.msg || res.message)
      }
    },

    selectBrand(e) {
      this.brand = e
    },
    selectSeason(e) {
      this.season = e
    },
    // selectSeason(season) {
    //   this.season = season
    // },
    goExamine() {
      console.log(this.brand)
      console.log(this.season)
      if (!this.brand) {
        this.$message.error('请选择品牌')
      }
      if (!this.season) {
        this.$message.error('请选择货季')
      } else {
        this.$router.push({ path: '/patternCenter/design/printList', query: { brand: this.brand, season: this.season } })
      }
    },
  },
}
</script>
<style lang="less" scoped>
.background {
  background: rgb(236, 236, 236);
  height: 100vh;
  .main {
    display: flex;
    flex-direction: column;
       padding: 10% 0;
    width:600px;
    margin: auto;
    .card {
      width: 100%;
      // margin: auto;
      margin-bottom: 30px;
      text-align: center;
      border-radius: 20px;
      box-shadow: 0 5px 15px -5px rgba(0, 0, 0, 0.5);
      .content {
        width: 100%;
      }
    }
  }
  .next {
       width: 200px;
    height: 50px;
    margin: auto;
    background: #faad1480;
    border-radius: 20px;
    text-align: center;
    line-height: 50px;
    font-size: 25px;
    color: #fff;
  }
}

</style>
